﻿@model SMECustomerWebsite.Models.ViewModels.PortfolioManagement.AccountPlanningHistoryViewModel

<div class="" role="tabpanel" data-example-id="togglable-tabs">
    @Html.Action("SubMenuPortfolioManagement", "System")
    <div id="myTabContent" class="tab-content">
        <div role="tabpanel" class="tab-pane fade active in" id="tab_content2" aria-labelledby="profile-tab">
            <div class="row">
                <div class="col-md-12">
                    <div class="x_panel">
                        <div class="x_title">
                            <h2>
                                @SMECustomerWebsite.Core.Resources.Resource.History
                                <small>
                                    @SMECustomerWebsite.Core.Resources.Resource.AccountPlanning
                                </small>
                            </h2>
                            <ul class="nav navbar-right panel_toolbox">
                                <li>
                                    <a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                                </li>
                            </ul>
                            <div class="clearfix"></div>
                        </div>
                        <div class="x_content">
                            <!-- Tabs -->
                            <div id="wizard_verticle" class="form_wizard wizard_verticle">
                                <ul class="list-unstyled wizard_steps">
                                    @foreach (var item in Model.ListHistory)
                                    {
                                        <li>
                                            <a href="#step-@item.Id">
                                                <span class="step_no">@(Model.ListHistory.IndexOf(item) + 1)</span>
                                                <span class="stepDesc">
                                                    <small>@item.ChangeDate</small>
                                                </span>
                                            </a>
                                        </li>
                                    }
                                </ul>
                                @foreach (var item in Model.ListHistory)
                                {
                                    <div id="step-@item.Id">
                                        <div class="form-horizontal form-label-left">
                                            <div class="form-group">
                                                <label class="control-label col-md-3 col-sm-3 col-xs-12" for="first-name">
                                                    Cif
                                                </label>
                                                <div class="col-md-6 col-sm-6 col-xs-12">
                                                    @Html.DisplayFor(m => m.Cif)
                                                    @Html.HiddenFor(m => m.Cif)
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="control-label col-md-3 col-sm-3 col-xs-12" for="first-name">
                                                    @SMECustomerWebsite.Core.Resources.Resource.MainSector
                                                </label>
                                                <div class="col-md-6 col-sm-6 col-xs-12" id="pm-ap-data-main-sector">
                                                    @*@Html.DisplayFor(m => m.MainSector)*@
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="control-label col-md-3 col-sm-3 col-xs-12" for="last-name">
                                                    @SMECustomerWebsite.Core.Resources.Resource.PaymentMethod
                                                </label>
                                                <div class="col-md-6 col-sm-6 col-xs-12" id="pm-ap-data-payment-method">
                                                    @*@Html.DisplayFor(m => m.PaymentMethod)*@
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label for="middle-name" class="control-label col-md-3 col-sm-3 col-xs-12">
                                                    @SMECustomerWebsite.Core.Resources.Resource.ActionPlan
                                                </label>
                                                <div class="col-md-6 col-sm-6 col-xs-12" id="pm-ap-data-action-plan">
                                                    @*@Html.DisplayFor(m => m.ActionPlanT62016)*@
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label for="middle-name" class="control-label col-md-3 col-sm-3 col-xs-12">
                                                    @SMECustomerWebsite.Core.Resources.Resource.WalletShare
                                                </label>
                                                <div class="col-md-6 col-sm-6 col-xs-12" id="pm-ap-data-wallet-share">
                                                    @*@Html.DisplayFor(m => m.WalletShare)*@
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label for="middle-name" class="control-label col-md-3 col-sm-3 col-xs-12">
                                                    @SMECustomerWebsite.Core.Resources.Resource.CrossSelling
                                                </label>
                                                <div class="col-md-6 col-sm-6 col-xs-12" id="pm-ap-data-sp-ban-cheo">
                                                    @*@Html.DisplayFor(m => m.SpBanCheo)*@
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label for="middle-name" class="control-label col-md-3 col-sm-3 col-xs-12">
                                                    @SMECustomerWebsite.Core.Resources.Resource.Issue
                                                </label>
                                                <div class="col-md-6 col-sm-6 col-xs-12" id="pm-ap-data-vuong-mac">
                                                    @*@Html.DisplayFor(m => m.VuongMac)*@
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label for="middle-name" class="control-label col-md-3 col-sm-3 col-xs-12">
                                                    @SMECustomerWebsite.Core.Resources.Resource.Suggestion
                                                </label>
                                                <div class="col-md-6 col-sm-6 col-xs-12" id="pm-ap-data-kh-ho-tro">
                                                    @*@Html.DisplayFor(m => m.KhHoTro)*@
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                }

                            </div>
                            <!-- End SmartWizard Content -->
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

@section scripts
{
    <script src="/scripts/tableeditable/dataTables.rowsGroup.js"></script>
    <!-- jQuery Smart Wizard -->
    <script src="/scripts/vendors/jQuery-Smart-Wizard/js/jquery.smartWizard.js"></script>
    <!-- Custom Theme Scripts -->
    @foreach (var item in Model.ListHistory)
    {
        <script type="text/javascript">
            $(document).ready(function () {
                //var data_@item.Id =@Html.Raw(Json.Encode(item.Value));
                var obj = $.parseJSON(@Html.Raw(Json.Encode(item.Value)));
                $('#pm-ap-data-main-sector').html(obj['MainSector']);
                $('#pm-ap-data-payment-method').html(obj['PaymentMethod']);
                $('#pm-ap-data-action-plan').html(obj['ActionPlanT62016']);
                $('#pm-ap-data-wallet-share').html(obj['WalletShare']);
                $('#pm-ap-data-sp-ban-cheo').html(obj['SpBanCheo']);
                $('#pm-ap-data-vuong-mac').html(obj['VuongMac']);
                $('#pm-ap-data-kh-ho-tro').html(obj['KhHoTro']);
            })
        </script>
    }
    <!-- jQuery Smart Wizard -->
    <script>
        $(document).ready(function () {
            $('#wizard_verticle').smartWizard({
                // Properties
                selected: @Model.ListHistory.IndexOf(Model.ListHistory.Where(x=>x.IsCurrent==true).Select(x=>x).FirstOrDefault()),  // Selected Step, 0 = first step
                keyNavigation: true, // Enable/Disable key navigation(left and right keys are used if enabled)
                enableAllSteps: true,  // Enable/Disable all steps on first load
                transitionEffect: 'slide', // Effect on navigation, none/fade/slide/slideleft
                contentURL: null, // specifying content url enables ajax content loading
                contentURLData: null, // override ajax query parameters
                contentCache: true, // cache step contents, if false content is fetched always from ajax url
                cycleSteps: true, // cycle step navigation
                enableFinishButton: false, // makes finish button enabled always
                hideButtonsOnDisabled: false, // when the previous/next/finish buttons are disabled, hide them instead
                errorSteps: [],    // array of step numbers to highlighting as error steps
                labelNext: 'Next', // label for Next button
                labelPrevious: 'Previous', // label for Previous button
                labelFinish: 'Finish',  // label for Finish button
                noForwardJumping: false,
                ajaxType: 'POST',
                // Events
                onLeaveStep: null, // triggers when leaving a step
                onShowStep: null,  // triggers when showing a step
                onFinish: null,  // triggers when Finish button is clicked
                includeFinishButton: false,   // Add the finish button
                reverseButtonsOrder: false, //shows buttons ordered as: prev, next and finish
            });

            $('.buttonNext').addClass('btn btn-success');
            $('.buttonPrevious').addClass('btn btn-primary');
            $('.buttonFinish').addClass('btn btn-default');
        });
    </script>
    <!-- /jQuery Smart Wizard -->
}